<!--
 * @Author: coocase
 * @Date: 2021-05-02 18:52:11
 * @LastEditTime: 2021-05-13 13:14:20
 * @LastEditors: coocase
 * @Description:
 * @FilePath: \git\dami\src\pages\detail\detailInfo.vue
-->
<template>
    <Row>
        <Col span="18">
            <Menu class="menu" mode="horizontal" >
                <MenuItem class="menu-title" name="1">
                <a href="#baseInfo">自我介绍</a>
                </MenuItem>
                <MenuItem class="menu-title" name="3">
                <a href="#comment">评论</a>
                </MenuItem>
            </Menu>
            <div class="detail-info-base" >
                <a name='baseInfo'></a>
                <p class="title">自我介绍</p>
                <div class="words">
                    <div>
                        <p class="item-title">基本信息</p>
                        <p>介绍：{{ datas.basicDescription }}</p>

                    </div>
                    <div>
                        <p class="item-title">项目介绍</p>

                        <p>{{ datas.projectDescription }}</p>
                    </div>
                </div>
            </div>

            <div class="notice-list" >
                <a name='noticeInfo'></a>
                <p class="title">购票须知</p>
                <div class="words">
                    <div>
                        <p class="item-title">限购规则</p>
                        <ul>
                            <li>每笔订单最多购买6张</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">退票/换票规则</p>
                        <ul>
                            <li>
                                票品为有价证券，非普通商品，其背后承载的文化服务具有时效性，稀缺性等特征，不支持退换。
                            </li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">配送信息说明</p>
                        <ul>
                            <li>不支持修改配送电话、地址等信息</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">入场规则</p>
                        <ul>
                            <li>支持多种票品验票后入场，如二维码电子票。</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">儿童购票</p>
                        <ul>
                            <li>
                                本场演出1.2米以下儿童入场凭票入场，实名制购票，一人一票。
                            </li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">发票说明</p>
                        <ul>
                            <li>
                                演出开始前，去【APP-订单详情页】提交发票申请。演出结束后1个月左右邮寄给你，需自付邮费。
                            </li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">实名购票规则</p>
                        <ul>
                            <li>一张门票对应一个证件；证件支持：身份证</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">异常排单说明</p>
                        <ul>
                            <li>
                                对于异常订购行为，大麦网有权在订单成立或者生效之后取消相应订单。异常订购行为包括但不限于以下情形：
                                （1）通过同一ID订购超出限购张数的订单。
                                （2）经合理判断认为非真实消费者的下单行为，包括但不限于通过批量相同或虚构的支付账号、收货地址（包括下单时填写及最终实际收货地址）、收件人、电话号码订购超出限购张数的订单。
                            </li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="notice-list">
                <a name='noticeInfo2'></a>
                <p class="title">观演须知</p>
                <div class="words">
                    <div>
                        <p class="item-title">演出时长</p>
                        <ul>
                            <li>90分钟左右，含中场休息。</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">入场时间</p>
                        <ul>
                            <li>请于开始前约30分钟入场</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">主要演员</p>
                        <ul>
                            <li>李晓惠 许怡欣 成浩 杨静姝 赵紫琪</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">最低演出时长</p>
                        <ul>
                            <li>约90分</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">禁止携带物品</p>
                        <ul>
                            <li>
                                由于安保和版权的原因，大多数演出、展览及比赛场所禁止携带食品、饮料、专业摄录设备、打火机等物品，请您注意现场工作人员和广播的提示，予以配合。
                            </li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">寄存说明</p>
                        <ul>
                            <li>
                                无寄存处,请自行保管携带物品，谨防贵重物品丢失。
                            </li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">
                            大麦网初始开售时全场可售门票总张数
                        </p>
                        <ul>
                            <li>400</li>
                        </ul>
                    </div>
                    <div>
                        <p class="item-title">转送说明</p>
                        <ul>
                            <li>
                                本项目支持电子票转送，转送功能将在演出前24小时关闭。（注：当前仅支持大麦下单用户，暂不支持淘宝／天猫下单用户发起转送，仅支持大麦APP发起和接收转送票品）
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <a name="comment"></a>
            <comment :datas="datas" v-if="datas"></comment>
        </Col>
        <Col span="6">
            <sider></sider>
        </Col>
    </Row>
</template>

<script>
import Sider from '@/components/Sider';
import comment from "./detailInfoComment";
export default {
    name: "detailInfo",
    props: ["datas"],
    components: {
        comment,
        Sider,
    },
    methods: {
    },
    mounted:function () {

    }
};
</script>

<style scoped>
a{
    text-decoration: none;
    color: black;
}
li,
ul {
    list-style: none;
}

.notice-list,
.detail-info-base {
    margin-bottom: 50px;
    padding: 20px;
}
.menu{
    margin-bottom: 20px;
}
.menu-title{
    font-size: 20px;
}
.notice-list .title,
.detail-info-base .title {
    padding-bottom: 14px;
    margin-bottom: 23px;
    font-size: 20px;
    color: #000;
    border-bottom: 1px solid #e2e2e2;
}
.notice-list .words .item-title {
    color: #999;
    font-size: 13px;
}
.notice-list .words p,
.detail-info-base .words p {
    font-size: 16px;
    color: #4a4a4a;
    line-height: 30px;
}
.detail-info-base .words .item-title,
.detail-info-base .words .item-name {
    font-weight: bold;
}

.notice-list .words li {
    line-height: 26px;
    padding-bottom: 15px;
    font-size: 16px;
    color: #4a4a4a;
}
</style>
